<!DOCTYPE html>
<html>
<head>
  <title>WebSocket Notice</title>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
  <!--  <link href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/3.4.1/css/bootstrap.min.css"-->
  <!--        rel="stylesheet">-->
  <!--  <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.js"></script>-->
  <!--  <script src="https://cdn.bootcdn.net/ajax/libs/sockjs-client/1.4.0/sockjs.min.js"></script>-->
  <!--  <script src="https://cdn.bootcdn.net/ajax/libs/stomp.js/2.3.3/stomp.min.js"></script>-->
  <!--   -->
  <link href="/webjars/bootstrap/css/bootstrap.min.css"
        rel="stylesheet">
  <link href="/main.css" rel="stylesheet">
  <script type="text/javascript" src="/webjars/jquery/jquery.min.js"></script>
  <script type="text/javascript" src="/webjars/sockjs-client/sockjs.min.js"></script>
  <script type="text/javascript" src="/webjars/stomp-websocket/stomp.min.js"></script>
  <script type="text/javascript" src="/notice.js"></script>
</head>
<body>
<noscript><h2 style="color: #ff0000">Seems your browser doesn't support Javascript! Websocket relies
  on Javascript being
  enabled. Please enable
  Javascript and reload this page!</h2></noscript>
  <div id="main-content" class="container" style="margin-top: 10px;">
    <div class="row">
      <div class="col-md-6">
        <form class="navbar-form" style="margin-left:0px">
          <div class="form-group">
            <label>WebSocket STOMP 连接：</label>
            <button id="connect" class="btn btn-primary" type="button">进行连接</button>
            <button id="disconnect" class="btn btn-danger" type="button">断开连接</button>
          </div>
        </form>
      </div>
    </div>

    <div class="row">
      <div class="col-md-6">
        <form class="navbar-form" style="margin-left:0px">
          <div class="form-group">
            <label for="content">发送的消息内容：</label>
            <input type="text" id="content" class="form-control" placeholder="消息内容">
          </div>
          <button id="send" class="btn btn-info" type="button">发送</button>
        </form>
      </div>
    </div>
    </br>

    <div class="row">
      <div class="col-md-12">
        <table id="conversation" class="table table-sm  table-striped">
          <thead>
          <tr>
            <th>接收到的消息：</th>
          </tr>
          </thead>
          <tbody id="responses">
          </tbody>
        </table>
      </div>
    </div>

  </div>
</body>
</html>
